<template>
    <div>
        <el-image :src="imgUrl" @click="edit" style="width: 360px;height: 200px;border-radius: 10px;" v-if="imgUrl" />
        <div v-else>
            <el-upload class="upload-demo" drag :headers="headers" :action="`${$apiHost}/common/upload`"
                :on-success="onSuccess" accept=".jpg,.png,.jpeg">
                <i class="el-icon-upload"></i>
                <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
                <!-- <div class="el-upload__tip" slot="tip">文件不超过{{ size }}MB</div> -->
            </el-upload>
        </div>
    </div>
</template>
<script>
export default {
    computed: {
        headers() {
            return {
                token: this.tokenv3 || window.$quinn.getStorage("tokenv3")
            };
        },
    },
    data() {
        return {

            imgUrl: ''
        }
    },
    methods: {
        edit() {
            this.imgUrl = ''
        },
        onSuccess(e) {
            this.imgUrl = this.$imgHost + e.data;
            this.$emit('url', e.data[0]);
        }
    }
}
</script>
